<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8"></meta>
        <title>CRUD</title>
        <link rel="stylesheet" type="text/css" href="jquery-easyui-1.7.0/themes/default/easyui.css" />
        <link rel="stylesheet" type="text/css" href="jquery-easyui-1.7.0/themes/icon.css" />
        <script type="text/javascript" src="jquery-easyui-1.7.0/jquery.min.js"></script>
        <script type="text/javascript" src="jquery-easyui-1.7.0/jquery.easyui.min.js"></script>
        <script type="text/javascript" src="jquery-3.2.1/jquery-3.2.1.min.js"></script>
        <!-- 中文化 -->
        <script type="text/javascript" src="jquery-easyui-1.7.0/locale/easyui-lang-zh_CN.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
        	getTemplet();
            $('#menu').tree({    
     		    url: 'buildTree/getTree',  
     		   method: 'GET',  
     		   loadFilter: function(data){    
     		        if (data.result){    
     		            return data.result;    
     		        } else {    
     		            return data;
     		        }    
     		    }    
     	   }); 
          });
        
        function addRule(){
        	$('templetId').change(function() { SelectChange(); });
        	function  SelectChange(){
        		var selectValue = $("option:selected").val();
        		$('tempRule').style.display="";
        		$('tempRule').src="/templet"+selectValue;
        	}
        }
        
        function getValue(){
            var str = $("#templetId option:selected").val();   //获得选中的值
            $.ajax({
                type:"post",
                dataType:"json",
                url:"/interactive/getTempId",
                data:{'select':str},
                success:function(msg){
                    if(msg){
                        alert(msg);
                    }
                }
            });
        }
        
        function getTemplet(){
        	$.ajax({
                url: urlFont + "/interactive/getTemplet",
                type: 'post',
                data: {
                },
                async: false,   //如果不加，无法实现数据传值
                dataType: 'json',
                success: function (datajson) {
                    var select = $("#cTempletName");
                    select.append("<option value=''>请选择</option>");
                    $(datajson).each(function (key) {  //循环读取后台传来的Json数据
                         var tempId = datajson[key].tempId;   //角色id
                         var tempName = datajson[key].tempName; //角色名称
                        //调用自定义方法
                        AppendNode(tempId, tempName);   //将value和text添加到下拉框中
                    });
                },
                error: function () {
                    alert("出现错误");
                }
            });
        	function AppendNode(value, text) {
           	 	$("#tempId").append("<option value='" + value + "'>" + text + "</option>");
        	}
        }
        
        
        function getChecked(){
			var nodes = $('#menu').tree('getChecked');
			var s = '';
			for(var i=0; i<nodes.length; i++){
				if (s != '') s += ',';
				s += nodes[i].text;
			}
			$.ajax({
                type:"post",
                dataType:"text",
                url:"/interactive/getMsObject",
                data:{s},
                success:function(msg){
                    if(msg){
                        alert(msg);
                    }
                }
            });
			
	        $('.indipage').html('');
	        $('.indipage-inner').load("./indipage.jsp);
	        $('#indiId').style.display="";
		}
        
        //$('.indipage').html('');
        //$('.indipage-inner').load("./indipage.jsp);
        </script>
    </head>
    
    <body>
    <ul id="menu" class="easyui-tree">
    </ul>
    <select style="width: 180px;height: 30px;" class="ipt" id="templetId" name="templetName">
    </select>
    <div style="display:none"  id="tempRule">
    	<iframe src="" name="123" width="10%" height="300" scrolling="auto" frameborder="0">
    </div>
    
    <span style="font-size:18px;">
    </span>
	<div class="indipage">
	    <div class="indipage-inner" style="display:none" id="indiId">
	                  
	    </div>
	</div>
    </body>

</html>